<!--
  * 审核
  *
  * @Author:    syf
  * @Date:      2025-06-04 14:41:53
  * @Copyright  畅想科技
-->
<template>
  <a-modal
      :title="form.shState==='approvaling' ? '审核' : '详情'"
      :open="visibleFlag"
      @cancel="onClose"
      :maskClosable="false"
      :destroyOnClose="true"
  >
    <a-card >
    <div class="info-box">
      <a-row class="smart-margin-top10">
        <a-col :span="18">
                <h4>用户信息：</h4>
          <a-row class="detail-info">
            <a-col v-if="detail.orderId!==''&detail.orderId!==null" :span="18"> 订单编号： {{ detail.orderId }}</a-col>
          </a-row>
          <a-row class="detail-info">
            <a-col v-if="detail.competeTime!==''&detail.competeTime!==null" :span="18">完成时间：{{ detail.competeTime }}</a-col>
          </a-row>
          <a-row class="detail-info">
            <a-col v-if="detail.orderKind!==''&detail.orderKind!==null" :span="18"> 订单类型： 
              {{ $smartEnumPlugin.getDescByValue('ORDERS_STATUS_ENUM', detail.orderKind) }}
            </a-col>
          </a-row>
          <a-row class="detail-info">
            <a-col v-if="detail.orderStartName!==''&detail.orderStartName!==null" :span="18"> 取货地址： {{ detail.orderStartName }}</a-col>
          </a-row>
          <a-row>            
            <a-col v-if="detail.orderEndName!==''&detail.orderEndName!==null" :span="18"> 配送地址： {{ detail.orderEndName }}</a-col>
          </a-row>
          <a-row class="detail-info">
            <a-col v-if="detail.orderContentName!==''&detail.orderContentName!==null" :span="12">订单内容：{{ detail.orderContentName }}</a-col>
          </a-row>          
          <a-row class="detail-info">
            <a-col v-if="detail.orderPrice!==''&detail.orderPrice!==null" :span="12">订单价格：{{ detail.orderPrice }}元</a-col>
          </a-row> 
          <a-row class="detail-info" v-if="detail.orderState==='已完成'">
            <a-col v-if="detail.competeTime!==''&detail.competeTime!==null" :span="12">完成时间：{{ detail.competeTime }}</a-col>
          </a-row>
        </a-col>
        <a-col :span="6">
          <p class="detail-right-title">订单状态:</p>
          <a-typography-text class="detail-right" :type="'warning'" v-if="detail.orderStateName!=='已完成'">
            {{ detail.orderStateName }}
          </a-typography-text>
          <a-typography-text class="detail-right" :type="'success'" v-if="detail.orderStateName==='已完成'">
            {{ detail.orderStateName }}
          </a-typography-text>
        </a-col>
      </a-row>
    </div>
    <div class="info-box">
      <h4>用户信息：</h4>
    <a-row class="smart-margin-top10">
      <a-col :span="24">
      <a-row class="detail-info">
          <a-col v-if="detail.userName!==''&detail.userName!==null" :span="12" @click="handCopy(detail.userName)"> 用户昵称： {{ detail.userName }}</a-col>
          <a-col v-if="detail.userPhone!==''&detail.userPhone!==null" :span="12" @click="handCopy(detail.userPhone)"> 联系电话：{{ detail.userPhone }}</a-col>
      </a-row>
      </a-col>
    </a-row>
    </div>
    <div class="info-box" v-if="detail.reMark!==''&detail.reMark!==null">
      <h4>备注信息：</h4>
      <a-col :span="24">{{ detail.reMark }}</a-col>
    </div>

    <div class="info-box" v-if="detail.jdyId!==''&detail.jdyId!==null">
      <h4>接单员信息：</h4>
      <a-row class="smart-margin-top10">
        <a-col :span="24">
          <a-row class="detail-info">
            <a-col :span="12" v-if="detail.jdyName!==''&detail.jdyName!==null" @click="handCopy(detail.jdyName)"> 接单员名称： {{ detail.jdyName }}</a-col>
            <a-col :span="12" v-if="detail.jdyPhone!==''&detail.jdyPhone!==null" @click="handCopy(detail.jdyPhone)"> 联系电话：{{ detail.jdyPhone }}</a-col>
            <a-col :span="12" v-if="detail.jdyTime!==''&detail.jdyTime!==null"> 接单时间：{{ detail.jdyTime }}</a-col>
          </a-row>
        </a-col>
      </a-row>
    </div>
  </a-card>
  <br>
    <a-form ref="formRef" :model="form" :rules="rules" >

                    <!-- <a-form-item label="举报人员ID"  name="userId">
                      <a-input-number style="width: 100%" v-model:value="form.userId" placeholder="举报人员ID" />
                    </a-form-item>
                    <a-form-item label="审核种类"  name="shType">
                      <a-input-number style="width: 100%" v-model:value="form.shType" placeholder="审核种类，如订单审核，用户审核" />
                    </a-form-item>
                    <a-form-item label="举报理由"  name="shReason">
                      <a-input style="width: 100%" v-model:value="form.shReason" placeholder="举报理由" />
                    </a-form-item>
                    <a-form-item label="审核类型"  name="reportedId">
                      <a-input-number style="width: 100%" v-model:value="form.reportedId" placeholder="被举报ID，类为订单，此为订单id，类为用户。此为用户id" />
                    </a-form-item>
                    <a-form-item label="审核人员名称"  name="shBy">
                      <a-input style="width: 100%" v-model:value="form.shBy" placeholder="审核人员名称" />
                    </a-form-item> -->
                    <a-form-item label="快捷回复:" >                      
                        <a-select
                          v-model:value="form.shReply"
                          mode="multiple"
                          style="width: 100%"
                          placeholder="Please select"
                        >
                        <option value="已记录举报内容">已记录举报内容</option>
                        <option value="感谢你的建议">感谢你的建议</option>
                        </a-select>
                     </a-form-item>

                    <a-form-item label="审核回复:"  name="shReply">
                      <textarea v-model="form.shReply" style="width: 100%; height: 100px; outline: none" placeholder="审核回复"></textarea>
                    </a-form-item>
                    <!-- <a-form-item label="审核完成时间"  name="shTime">
                      <a-date-picker show-time valueFormat="YYYY-MM-DD HH:mm:ss" v-model:value="form.shTime" style="width: 100%" placeholder="审核完成时间" />
                    </a-form-item> -->
    </a-form>

    <template #footer>
      <a-space>
        <a-button @click="onClose">取消</a-button>
        <a-button v-show="form.shState==='approvaling'" type="primary" @click="onSubmit">通过</a-button>
      </a-space>
    </template>
  </a-modal>
</template>
<script setup>
  import { reactive, ref, nextTick } from 'vue';
  import _ from 'lodash';
  import { message } from 'ant-design-vue';
  import { SmartLoading } from '/@/components/framework/smart-loading';
  import { shApi } from '/@/api/business/sh/sh-api';
  import { smartSentry } from '/@/lib/smart-sentry';
  import { orderApi } from '/@/api/business/order/order-api';
  const handCopy = (data) => {
    navigator.clipboard.writeText(data);
    message.success("内容已复制到剪贴板");
  };
  // ------------------------ 事件 ------------------------

  const emits = defineEmits(['reloadList']);

  // ------------------------ 显示与隐藏 ------------------------
  // 是否显示
  const visibleFlag = ref(false);

  function show(rowData) {
    Object.assign(form, formDefault);
    if (rowData && !_.isEmpty(rowData)) {
      Object.assign(form, rowData);
      getDetail(rowData.reportedId);
    }
    visibleFlag.value = true;
    nextTick(() => {
      formRef.value.clearValidate();
    });
  }

  function onClose() {
    Object.assign(form, formDefault);
    visibleFlag.value = false;
  }

  // ------------------------ 表单 ------------------------
  let detail = reactive({
    // param: '',
    // url: '',
  });
  async function getDetail(orderId) {
    try {
      SmartLoading.show();
      let res = await orderApi.detail(orderId);
      detail = Object.assign(detail, res.data);
    } catch (e) {
      smartSentry.captureError(e);
    } finally {
      SmartLoading.hide();
    }
  }
  // 组件ref
  const formRef = ref();

  const formDefault = {
          id:undefined,
          shId: undefined,
          userId: undefined, //举报人员ID
          shType: undefined, //审核种类，如订单审核，用户审核
          shReason: undefined, //举报理由
          shState: undefined, //审核状态，approvaling，待审核，approvaied，已审核
          reportedId: undefined, //被举报ID，类为订单，此为订单id，类为用户。此为用户id
          shBy: undefined, //审核人员名称
          shReply: undefined, //审核回复
          shTime: undefined, //审核完成时间
  };

  let form = reactive({ ...formDefault });

  const rules = {
  };

  // 点击确定，验证表单
  async function onSubmit() {
    try {
      var a = form.shReply.join('，');
      form.shReply=a;
      await formRef.value.validateFields();
      save();
    } catch (err) {
      message.error('参数验证错误，请仔细填写表单数据!');
    }
  }

  // 新建、编辑API
  async function save() {
    SmartLoading.show();
    try {
      if (form.shId) {
        await shApi.update(form);
      } else {
        await shApi.add(form);
      }
      message.success('操作成功');
      emits('reloadList');
      onClose();
    } catch (err) {
      smartSentry.captureError(err);
    } finally {
      SmartLoading.hide();
    }
  }

  defineExpose({
    show,
  });
</script>
